<template>
  <h1>个人简历练习</h1>
  <table>
    <tr>
      <td>照片</td>
      <td><img :src="user.imgUrl" width="120px"></td>
    </tr>
    <tr>
      <td>姓名</td>
      <td>{{user.name}}</td>
    </tr>
    <tr>
      <td>年龄</td>
      <td>{{user.age}}</td>
    </tr>
    <tr>
      <td>好友</td>
      <td>
        <ul>
          <li v-for="f in user.friends">{{f}}</li>
        </ul>
      </td>
    </tr>
  </table>
  <button @click="f">点击加载数据</button>
</template>
<script setup>
  import {ref} from "vue";

  const user = ref({})
  const f = () => {
    user.value = {
      imgUrl:'fcq.jpg',
      name: '张三',
      age: 18,
      friends: ['李四', '王五']
    }
  }
</script>


<style scoped>

</style>